<template>
  <div class="flex-main">
    <div class="flex-body">
      <div class="over">
        <div class="m-header"></div>
        <div class="m-mineheader">
          <div class='tc'>
            <img src='@/assets/images/p_02.jpg' class='m-mineheadimg'>
          </div>
          <div class='tc m-username'>{{username}}</div>
          <div class='m-flowerAjifen'>
            <span>
              <img src='@/assets/images/flower@2x.png' mode='widthFix'> 花瓣 {{Reward}}
            </span>
            <span>
              <img src='@/assets/images/jifen@2x.png' mode='widthFix'> 积分 {{Integral}}
            </span>
          </div>
        </div>
      </div>

      <div class="m-ordermenu">
        <p class="m-menutit">我的订单<em class="m-more" @click="toMyorders">全部订单</em></p>
        <ul class="m-menulist">
          <li v-for="(item,index) in orderMenu" :key="index" @click="toMyorders">
            <img :src="item.imgUrl" alt="">
            <p>{{item.text}}</p>
            <em v-if="index==0 && ordernum.nopayNum!=0">{{ordernum.nopayNum}}</em>
            <em v-if="index==1 && ordernum.shipnum!=0">{{ordernum.shipnum}}</em>
            <em v-if="index==2 && ordernum.receiptnum!=0">{{ordernum.receiptnum}}</em>
            <em v-if="index==3 && ordernum.allNum!=0">{{ordernum.allNum}}</em>
          </li>
        </ul>
      </div>

      <div class="m-ordermenu">
        <p class="m-menutit">必备工具</p>
        <ul class="m-menulist">
          <li v-for="(item,index) in menulist" :key="index" @click="toPage(item.pathName)">
            <img :src="item.imgUrl" alt="">
            <p>{{item.text}}</p>
          </li>
        </ul>
      </div>
    </div>
    <my-recommend v-if="showRecommend" @closeRecommend="closeRecommend" :list="team"></my-recommend>
    <fixed-move @click.native="serverStarEvent"></fixed-move>
    <server-star v-if="showServerStar" @closeServerStar="closeServerStar"></server-star>

    <footer-nav class="flex-bottom"></footer-nav>
  </div>
</template>
<script>
  import {
    orderNum,
    getCustomerData,
    getMyTeam,
    pointScoreList,
  } from '@/api/mine';
  export default {
    name: '',
    data() {
      return {
        ordernum: {
          allNum: 0,
          nopayNum: 0,
          shipnum: 0,
          receiptnum: 0,
        },
        orderMenu: [{
          imgUrl: require('@/assets/images/orderPay-icon@2x.png'),
          text: '待付款'
        }, {
          imgUrl: require('@/assets/images/orderSend-icon@2x.png'),
          text: '待发货'
        }, {
          imgUrl: require('@/assets/images/orderShou-icon@2x.png'),
          text: '待收货'
        }, {
          imgUrl: require('@/assets/images/orderAll-icon@2x.png'),
          text: '待评价'
        }],
        menulist: [{
          imgUrl: require('@/assets/images/mine-appoint@2x.png'),
          text: '我的预约',
          pathName: 'myAppointment'
        }, {
          imgUrl: require('@/assets/images/mine-collage@2x.png'),
          text: '我的拼团',
          pathName: 'mySpelling'
        }, {
          imgUrl: require('@/assets/images/projectRated@2x.png'),
          text: '我的评价',
          pathName: 'myEvaluation'
        }, {
          imgUrl: require('@/assets/images/balanceDetail@2x.png'),
          text: '余额详情',
          pathName: 'myRemainder'
        }, {
          imgUrl: require('@/assets/images/xfRecord@2x.png'),
          text: '消费记录',
          pathName: 'myRecord'
        }, {
          imgUrl: require('@/assets/images/jfMall@2x.png'),
          text: '积分商城',
          pathName: 'integration'
        }, {
          imgUrl: require('@/assets/images/recommend@2x.png'),
          text: '我的团队',
          pathName: 'myRecommend'
        }, {
          imgUrl: require('@/assets/images/jlDetail@2x.png'),
          text: '奖励明细',
          pathName: 'reward'
        }, {
          imgUrl: require('@/assets/images/withdrawApply@2x.png'),
          text: '提现申请',
          pathName: 'withdrawal'
        }, {
          imgUrl: require('@/assets/images/mine-addr@2x.png'),
          text: '地址管理',
          pathName: 'address'
        }, {
          imgUrl: require('@/assets/images/mine-setting@2x.png'),
          text: '修改资料',
          pathName: 'infoEdit'
        }],
        showRecommend: false, //显示我的团队
        showServerStar: false, //显示服务之星
        CustomerID: this.$utils.uid, //用户id
        username: '用户名',
        Reward: 0,
        Integral: 0,
        team: [],
      }
    },
    components: {
      fixedMove: () => import('@/model/mine/fixedmove'),
      myRecommend: () => import('@/model/mine/myRecommend'),
      serverStar: () => import('@/model/mine/serverStar'),
    },
    methods: {
      // 获取订单数目
      getOrderNum() {
        let that = this;
        let param = {
          customer_id: that.$utils.uid,
        }
        orderNum(param).then((result) => {
          that.ordernum = result;
        }).catch((err) => {

        });
      },
      // 跳转到我的订单列表
      toMyorders() {
        this.$router.push({
          name: 'myOrders'
        });
      },
      // 跳转到对应页面
      toPage(pathName) {
        if (pathName == 'myRecommend') {
          this.showRecommend = true;
        } else {
          this.$router.push({
            name: pathName
          });
        }
      },
      // 我的推荐
      closeRecommend() {
        this.showRecommend = false;
      },
      // 显示服务之星
      serverStarEvent() {
        this.showServerStar = true;
      },
      // 关闭服务之星
      closeServerStar() {
        this.showServerStar = false;
      },
      //获取用户名和花瓣数量
      CustomerData() {
        var param = {
          customer_id: this.CustomerID
        };
        getCustomerData(param).then((result) => {
          this.username = result.detail.nickname;
          this.Reward = result.detail.Reward;
          this.Integral = result.detail.Integral;
          this.$indicator.close();
        }).catch((err) => {
          this.$indicator.close();
        });
      },

      //我的团队
      MyTeam() {
        var param = {
            customer_id: this.CustomerID
        //   customer_id: '0091002101',
        };
        getMyTeam(param).then((result) => {
          this.team = result.list;
        }).catch((err) => {

        });
      }
    },
    mounted() {
      this.$indicator.open('加载中...');
      this.getOrderNum();
      this.CustomerData();
      this.MyTeam();
    }
  }

</script>
<style lang="less" scoped src="@/less/mine/mine.less"></style>
